<template>
<div>
  <el-row>
    <el-col :span="24" class="backClass" style="">
      <el-form :model="form" :rules="rules" label-width="100px" label-suffix="：">
        <el-form-item v-for="(v,k,i) in form" :label="labels[i]" :key="i" v-if='k!=="id"&&k!=="password"' :prop="k">
          <el-radio-group v-if="k=='sex'" v-model="form[k]">
            <el-radio-button :label="true">男</el-radio-button>
            <el-radio-button :label="false">女</el-radio-button>
          </el-radio-group>
          <el-date-picker v-else-if="k=='birthdate'||k=='accessdate'" v-model="form[k]" placeholder="请输入日期"></el-date-picker>
          <el-input v-else v-model="form[k]" style="width:600px" clearable></el-input>
        </el-form-item>
        <el-form-item>
          <template slot-scope="scope">
            <el-button type="primary" @click="save">保存</el-button>
          </template>
        </el-form-item>
      </el-form>
    </el-col>
  </el-row>
</div>  
</template>

<script>
import * as api from "@/api/student";

export default {
  data() {
    return {
      form: {
        id: "",
        studentid: "",
        password: "",
        name: "",
        sex: true,
        birthdate: "",
        nation: "",
        Idcard: "",
        address: "",
        accessdate: "",
        specialtytype: ""
      },
      labels: [
        "编号",
        "学号",
        "密码",
        "姓名",
        "性别",
        "出生日期",
        "民族",
        "身份证",
        "家庭住址",
        "入学时间",
        "专业"
      ],
      rules: {
        studentid: [{ required: true, message: "请输入学号", trigger: "blur" }],
        name: [{ required: true, message: "请输入姓名", trigger: "blur" }]
      }
    };
  },
  methods: {
    save() {
      this.form.password = this.form.studentid;
      api.addStudent(this.form).then(res => {
        if (res.code !== 200) {
          this.$message.error("添加失败!"+res.message);
        } else {
          this.$message({
            message: "添加成功！",
            type: "success"
          });
          this.$router.go(0)
        }
      });
    }
  }
};
</script>

<style scoped>
  
</style>
